import { useEffect } from 'react'
import { Outlet } from 'react-router-dom'
import { useMeta } from '@/stores'
import Header from '@/components/Header'
import BottomNav from '@/components/BottomNav'
import styles from './index.module.less'

const MainPage = (props: any) => {

  const { meta } = useMeta((state) => state)
  const {
    title,
    keywords,
    description,
  } = meta

  useEffect(() => {
    document.title = meta.title
  }, [meta])

  return <div className={styles.MainPage}>
    <Header title={title} />
    <div className={styles.content}>
      <Outlet />
    </div>
    {meta.keywords == 'menu-page' && <BottomNav />}
  </div>
}

export default MainPage
